<template>
    <tn-popup v-model="show" mode="center" @open="open" @close="close">
        <view class="popup bdbx" :style="{ backgroundImage: `url(https://www.dingxians.cn/upload/20250402/67ed233c2a0b8.png)` }">
            <view class="rule_title_box">抽奖码</view>
            <view class="close" @click="close" style="background-image: url('https://www.dingxians.cn/upload/20250513/6822ecb30f58e.png');"></view>
            <view class="list_box" v-for="(item, index) in codeList" :key="index">
                {{ item.code }}
            </view>
        </view>
    </tn-popup>

</template>
<script>
export default {
    props: {
        show: {//弹窗显示/隐藏
            type: Boolean,
            default: true
        },
        codeList: {//抽奖码list
            type: Array,
            default: []
        },
    },
    data() {
        return {

        }
    },
    methods: {
        open() {

        },
        close() {
            this.$emit("ruleClose")
        }
    }
}
</script>
<style lang="scss" scoped>
.popup {
    width: 628rpx;
    height: 739rpx;
    background-size: 100% 100%;
    position: relative;
    box-sizing: border-box;
    padding-top: 46rpx;

    .close {
        position: absolute;
        width: 48rpx;
        height: 48rpx;
        background-size: 100% 100%;
        top: 44rpx;
        right: 53rpx;
    }

    .rule_title_box {
        margin: auto;
        width: 255rpx;
        height: 112rpx;
        line-height: 112rpx;
        margin-bottom: 33rpx;
        background-size: 100% 100%;
        font-family: Source Han Serif CN;
        font-weight: bold;
        font-size: 40rpx;
        color: #FFFFFF;
        text-align: center;
    }

    .list_box {
        width: 100%;
        height: 40rpx;
        text-align: center;
        line-height: 40rpx;
        margin-bottom: 20rpx;
        font-family: Source Han Serif CN;
        font-weight: 400;
        font-size: 30rpx;
        color: #FFFFFF;

    }
}
</style>